import React, { useState, useRef } from 'react';
import { PageContainer } from '@ant-design/pro-layout';
import { Tooltip, Image } from 'antd';
import type { ProColumns, ActionType } from '@ant-design/pro-table';
import ProTable from '@ant-design/pro-table';
import { userList } from './service';
import type { TableListItem, TableListPagination } from './data';
import { formatTime } from '@/utils/index';

const TableList: React.FC = () => {
    const actionRef = useRef<ActionType>();

    const columns: ProColumns<TableListItem>[] = [
        {
            title: '用户编号',
            dataIndex: 'guid',
            ellipsis: true,
        },
        {
            title: '用户昵称',
            dataIndex: 'nickName',
            ellipsis: true,
        },
        {
            title: '用户头像',
            dataIndex: 'headImg',
            search: false,
            render: (val: any) => <Image width={60} src={val} />,
        },
        {
            title: '绑定手机',
            dataIndex: 'mobilePhone',
            ellipsis: true,
        },
        {
            title: '状态',
            dataIndex: 'status',
            search: false,
            valueEnum: {
                1: {
                    text: '正常',
                    status: 'Processing',
                },
                2: {
                    text: '禁用',
                    status: 'Default',
                },
            },
        },
        {
            title: '类型',
            dataIndex: 'type',
            initialValue: '1',
        },
        {
            title: '注册时间',
            dataIndex: 'createTime',
            search: false,
            valueType: 'dateTime',
        },
        {
            title: '最后登录时间',
            dataIndex: 'lastLoginTime',
            search: false,
            valueType: 'dateTime',
        },
        {
            title: '操作',
            dataIndex: 'option',
            valueType: 'option',
            width: 100,
            render: (_, record) => [

            ],
        },
    ];

    return (
        <PageContainer>
            <ProTable<TableListItem, TableListPagination>
                headerTitle="查询表格"
                actionRef={actionRef}
                rowKey="guid"
                search={{
                    labelWidth: 120,
                }}
                request={userList}
                columns={columns}
            />

        </PageContainer>
    );
};

export default TableList;
